; (function () {
    //关注我们的下拉
    $(function () {
        $(".e").on("mouseenter", ".e_show", function () {
            $(this).parent().find(".e_down").show()
        })
        $(".e").on("mouseleave", ".e_show", function () {
            $(this).parent().find(".e_down").hide()
        })
    })

    //移入menuBox,menuBoxDowm1出现
    $(function () {
        $(".menuBox").on("mouseenter", function () {
            $(this).find(".menuBoxDown1").css("display", "block")
        }).on("mouseleave", function () {
            $(this).find(".menuBoxDown1").css("display", "none")
        })
    })
    //移入左边menuBoxDowm1添加边框,mid_infBox显示
    $(function () {
        $(".menuBoxDown1 li").on("mouseenter", function () {
            $(this).find(".mid_infBox").css("display", "block");
            $(this).css("border", "1px solid red")
            $(this).css("border-right", "none")
            $(this).parents(".menu").find(".menuBoxDown2").css("display", "none")
        });
        $(".menuBoxDown1 li").on("mouseleave", function () {
            $(this).find(".mid_infBox").css("display", "none");
            $(this).css("border", "none");
            $(this).parents(".menu").find(".menuBoxDown2").css("display", "block")
        })
    })

    //移入mid_infBox,里面的a变红
    $(function () {
        $(".mid_infBox dd a").on("mouseenter", function () {
            $(this).css("color", "red")
        }).on("mouseleave", function () {
            $(this).css("color", "#666")
        })
    })

    //鼠标移入右边固定导航栏,弹出文字和改变颜色
    $(function () {
        $(".winBox li").on("mouseenter", function () {
            $(this).find("b").css("display", "block")
            $(this).find("i").css("backgroundColor", "red")
        }).on("mouseleave", function () {
            $(this).find("b").css("display", "none")
            $(this).find("i").css("backgroundColor", "#666")
        })
    })
    $(function () {
        $(".backTop").on("mouseenter", function () {
            $(this).find("b").css("display", "block")
            $(this).find("i").css("backgroundColor", "red")
        }).on("mouseleave", function () {
            $(this).find("b").css("display", "none")
            $(this).find("i").css("backgroundColor", "#666")
        })
    })
    //点击回到顶部
    $(function () {
        $(".backTop").on("click", function () {
            $("html,body").animate({
                scrollTop: 0
            })
        })
    })

    $.fn.extend({
        zoom() {
            // 核心公式
            // 小图/大图=小区域/大区域
            // 200/800 =40/300
            //小区域=(小图/大图)*大区域
            var $smallImg = this.find(".midImg");//小图
            var $smallArea = this.find(".midArea");//小区域
            var $bigArea = this.find(".bigImg");//大区域
            var $bigImg = this.find(".bigImg img");//大图

            var w = ($smallImg.width() / $bigImg.width()) * $bigArea.width();
            var h = ($smallImg.height() / $bigImg.height()) * $bigArea.height();

            $smallArea.css({
                width: w,
                height: h
            })
            $smallImg.on("mouseenter", function () {
                $smallArea.show();
                $bigArea.show();
            }).on("mouseleave", function () {
                $smallArea.hide();
                $bigArea.hide();
            })

            //在小图里移动
            $smallImg.on("mousemove", function (e) {
                //鼠标移动额左边值 (到页面的距离) -小图到页面的距离
                var mX = e.pageX - $(this).offset().left - $smallArea.width() / 2
                var mY = e.pageY - $(this).offset().top - $smallArea.height() / 2

                if (mX <= 0) {
                    mX = 0
                }
                if (mY <= 0) {
                    mY = 0
                }

                if (mX >= $smallImg.width() - $smallArea.width()) {
                    mX = $smallImg.width() - $smallArea.width()
                }
                if (mY >= $smallImg.height() - $smallArea.height()) {
                    mY = $smallImg.height() - $smallArea.height()
                }

                //小区域 移动
                $smallArea.css({
                    left: mX,
                    top: mY
                });

                //大图反向移动
                var oScale = $bigArea.width() / $smallArea.width();

                $bigImg.css({
                    left: oScale * mX * -1,
                    top: oScale * mY * -1
                });
            });
        }
    })
    $(function () {
        $(".pro-img").zoom();
    })
    
    $(function(){
        //-
        $(".les").on("click",function(){
            var num=$(this).parents(".pro-submit").find("input").val()
            num--
            if(num<=1){
                num=1
            }
            $(this).parents(".pro-submit").find("input").val(num)
        })
        //+
        $(".add").on("click",function(){
            var num=$(this).parents(".pro-submit").find("input").val()
            num++
            $(this).parents(".pro-submit").find("input").val(num)
        })
        $(".pro-buy").on("click",function(){
            var num=$(this).parent().find("input").val()
            var name="派克 PARKER 16款IM纯白白夹宝珠笔+笔记本礼盒"
            var price=530.00
            let oGoods={
                name:name,
                num:num,
                price:price
            }
            var oGoodsList=JSON.parse(localStorage.getItem("oGoods")||"[]")
            let isGoods=oGoodsList.findIndex(function(item){
                return item.name==oGoods.name
            })
            if(isGoods==-1){
                oGoodsList.push(oGoods)
                localStorage.setItem("oGoods",JSON.stringify(oGoodsList))
            }else{
                let num1=Number(oGoodsList[isGoods].num)
                let num2=Number(oGoods.num)
                oGoodsList[isGoods].num=num1+num2
                localStorage.setItem("oGoods",JSON.stringify(oGoodsList))
            }
        })
    })
})();